<template>
	<view class="salesion">
		<view class="sal_con public_sty">
			<view class="sal_title">
				<label class="radio">
					<radio value="" :checked="selectAll" style="transform:scale(0.7)" />
					<text>汤臣倍健</text>
				</label>
			</view>
			<view class="sal_shop">
				<view class="shops_box sal_box" v-for="(item, i) in salesShop.salesList" :key="i">
					<view class="shops_left">
						<label class="radio"><radio value="" style="transform:scale(0.7)" /></label>
						<view class="shops_img_box"><image class="shops_img" :src="item.imageL" mode=""></image></view>
					</view>
					<view class="shops_right">
						<view class="titles_letter text_letter_sty">
							<text>{{ item.shopname }}</text>
						</view>
						<view class="shops_num text_sml">
							<text>药品规格</text>
							<text>x{{ item.shopNum }}</text>
						</view>
						<view class="shops_pic">
							<text>￥</text>
							<text>{{ item.pic }}</text>
						</view>
					</view>
				</view>
			</view>
			<view class="sal_deils">
				<view class="sal_money sal_sty">
					<text>商品金额</text>
					<view class="text_sml ">
						<text>￥</text>
						<text>{{ salesShop.shopMoney }}</text>
					</view>
				</view>
				<view class="sal_freight sal_sty">
					<text>运费</text>
					<view class="text_sml ">
						<text>￥</text>
						<text>{{ salesShop.freight }}</text>
					</view>
				</view>
				<view class="sal_coupon sal_sty">
					<text>优惠券</text>
					<view class="text_error">
						<text>-￥</text>
						<text>{{ salesShop.coupon }}</text>
					</view>
				</view>
				<view class="sal_ pay sal_sty">
					<view class=""></view>
					<view class="">
						<text>实付款</text>
						<text class="text_error">￥{{ salesShop.pay }}</text>
					</view>
				</view>
			</view>
		</view>
		<view class="sal_remarks">
			<view class=""><text>1. 除药品质量原因外，药品不得退换，因药品质量原因退款时，无需退货。</text></view>
			<view class=""><text>2. 其他商品在收货后七天内支持退换，退换时需将货物退回</text></view>
		</view>
		<view class="">
			<button type="primary" class="btn"><text>确认选择</text></button>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			selectAll: false,
			salesShop: {
				shopName: '汤臣倍健',
				allCheck: false,
				shopMoney: 102.9,
				freight: 0,
				coupon: 10,
				pay: 92.9,
				salesList: [
					{
						imageL: '/static/uni.png',
						shopname: '健力多氨糖软骨素钙片中老年人专用',
						shopNum: 2,
						pic: 22.8,
						checkSta: false
					},
					{
						imageL: '/static/uni.png',
						shopname: '健力多氨糖软骨素钙片中老年人专用',
						shopNum: 2,
						pic: 22.8,
						checkSta: false
					}
				]
			}
		};
	}
};
</script>

<style lang="scss" scoped>
.salesion {
	padding: 30rpx;
	.sal_con {
		padding: 30rpx;
		.sal_title {
			display: flex;
			align-items: center;
			radio {
				margin-right: 20rpx;
			}
		}
		.sal_shop {
			margin-top: 28rpx;
			.sal_box {
				margin-bottom: 50rpx;
			}
		}
		.sal_deils {
			.sal_sty {
				display: flex;
				justify-content: space-between;
				margin: 20rpx 0rpx;
				font-size: 28rpx;
				color: #333333 !important;
			}
		}
	}
}
.sal_remarks {
	font-size: 26rpx;
	color: #999999;
	line-height: 44rpx;
	margin-top: 22rpx;
}

</style>
